<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="../static/css/prism.css" rel="stylesheet" />
</head>

<body>
    <h2>shift() 删除数组的第一个元素，并返回该元素（原地修改）</h2>
    <pre><code class="language-javascript">var arr = ['尚学堂', 'itbaizhan', 'WEB前端'];

arr.shift() // '尚学堂'
arr // ['itbaizhan', 'WEB前端']</code></pre>
    <h3>shift() 的常见用法</h3>
    <p>遍历并清空一个数组</p>
    <pre><code class="language-javascript">var list = [1, 2, 3, 4, 5, 6];
var item;

while (item = list.shift()) {
    console.log(item);
}

list // []</code></pre>
    <p style="font-family: Kaiti;">注意：</p>
    <p style="font-family: Kaiti;">当shift()一个空数组时，返回undefined，undefined对于js的条件表达式被视为<strong>false</strong></p>
    <pre><code class="language-javascript">var arr = [];
console.log(arr.shift());  // undefined</code></pre>

    <h2>unshift() 在数组的第一个位置添加元素，并返回添加新元素后的数组长度（原地修改）</h2>
    <pre><code class="language-javascript">var arr = ['尚学堂', 'itbaizhan', 'WEB前端'];

arr.unshift('baizhan'); // 4
arr // ['baizhan', '尚学堂', 'itbaizhan', 'WEB前端']</code></pre>
    <p>可以接受多个参数，这些参数都会添加到目标数组头部</p>
    <pre><code class="language-javascript">var arr = [ '尚学堂', 'itbaizhan' ];
arr.unshift('WEB前端', 'baizhan') // 4
arr // [ 'WEB前端', 'baizhan', '尚学堂', 'itbaizhan' ]</code></pre>

    <script src="../static/js/prism.min.js"></script>

    <script>
        var arr = [];
        console.log(arr.shift());
    </script>
</body>

</html>